import React from 'react'
import { Route, Redirect, Switch } from 'react-router-dom'
import { lazy, Suspense } from 'react'
import Loading from '@/components/Loading';


const Home = lazy(() => import('@/views/Home'))
const Cart = lazy(() => import('@/views/Cart'))
const Mine = lazy(() => import('@/views/Mine'))
const Login = lazy(() => import('@/views/Login'))
const Detail = lazy(()=> import('@/views/Detail'))
const Regist = lazy(()=> import('@/views/Regist'))

export default function Index() {
  return (
    <>
      <Suspense fallback={<Loading />}>
        <Switch>
          <Route path='/home' component={Home}></Route>
          <Route path='/cart' component={Cart}></Route>
          <Route path='/mine' component={Mine}></Route>
          <Route path='/login' component={Login}></Route>
          <Route path='/detail/:id' component={Detail}></Route>
          <Route path='/regist' component={Regist}></Route>
          <Redirect from="/" to='/home' exact></Redirect>
        </Switch>
      </Suspense>

    </>
  )
}
